<template>
<div>
    <div class="newslist" v-for="item in news" :key="item.id">
        
        <div class="words">
            <h2 class="title">
                <a :href="item.link" target="_blank">{{item.title}}</a>
            </h2>
        </div>
        <div class="image" v-if="item.havePic">
            <a :href="item.link" target="_blank">
                <img :src="item.img" alt="">
            </a>
        </div>
        <div class="aside">
            <span>{{item.channelName}}</span>
            <span>来源：{{item.source}}</span>
            <span>发布日期：{{item.pubDate}}</span>
        </div>
        <div class="content">
            {{item.content}}
        </div>
    </div>
</div>
</template>

<script>
export default {
    props:{
        news:{
            type:Array,
            default:()=>[]
        }
    }
}
</script>

<style scoped>
a{
    color: #333;
    text-decoration: none;
}
.newslist{
    width: 100%;
    padding: 10px;
    border-bottom: 1px solid #777;
    margin: 0 auto;
}
.image{
    float: left;
    padding: 10px;
}
.image img{
    height: 100px;
}
h2{
    color:blue;
}
.aside{
    font-size: 14px;
    color: #777;
}
.content{
    overflow: hidden;
    line-height: 30px;
    height: 120px;
}
</style>